// banner
.banner{
    .bannerPic{
        height: 420px;
        position: relative;
        overflow: hidden;

        .carouseImgCon{
            position: relative;
            a{
                position: absolute;
                left: 50%;
                margin-left: -960px;

                img {
                    opacity: 0;
                }
            }
        }

        .prev, .next{
            width: 50px;
            height: 50px;
            text-align: center;
            background: #d0cafd;
            color: #fff;
            font-size: 50px;
            line-height: 40px;
            overflow: hidden;
            border-radius: 50%;
            position: absolute;
            top: 50%;
            margin-top: -25px;
            cursor: pointer;
            //todo 不让双击选中
            -moz-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
            &:hover{
                background: #b19234;
            }
        }

        .prev{
            left: 10%;
        }

        .next{
            right: 10%;
        }

        .circle{
            height: 30px;
            width: 100%;
            text-align: center;
            position: absolute;
            bottom: 0; 

            span {
                display: inline-block;
                width: 8px;
                height: 8px;
                background: #fff;
                border-radius: 50%;
                margin: 0 10px;
                border: 1px solid #d6d5d5;
                cursor: pointer;

                &.active{
                    width: 4px;
                    height: 4px;
                    border: 3px solid #dfcead;
                    background: #a7936e;
                    transform: scale(2);
                    
                }

                &:hover{
                    width: 4px;
                    height: 4px;
                    border: 3px solid #dfcead;
                    background: #a7936e;
                    transform: scale(2);    
                }
            }
        }

    }
}

// 品牌制造商
#brand {
  width: 1090px;
  margin: 30px auto;

  .brandHeader{
    margin-bottom: 15px;
    .left {
        h3{
            display: inline;
            font: 30px/60px "microsoft yahei";
            color: #666;
        }
        
    }
    .right{
        margin-top: 30px;
        vertical-align: middle;
    }
  }
  .bImg{
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    .bBox{
        width: 357px;
        height: 320px;
        overflow: hidden;
        background: #d0cafd;
        text-align: center;
        position: relative;
        color: #666;

        h4{
            font: 24px/24px "microsoft yahei";
            font-weight: normal;

            z-index: 2;
            position: relative;

            margin-top: 40px; //这个会传递给父布局 div 需要解决
        }

        span{
            display: inline-block;
            border-top: 1px solid #666;
            padding-top: 20px;
            margin-top: 20px;

            z-index: 2;
            position: relative;
        }

        img{
            // width: 100%;
            // height: 100%;
            width: 357px;
            height: 320px;
            position: absolute;
            left: 0;
            top: 0;
        }

        div {
            position: relative;
            overflow: hidden;//解决会传递
            text-align: left;
            padding-left: 20px;
            background: #d000fd;
            width: 357px;
            height: 155px;
        }
        &:last-child{
            display: flex;
            flex-wrap: wrap;
            
            align-content: space-between;
            
            img{
                height: 155px;
            }
        }
    }
  }
}